<template>
  <div>
     <a-input v-model:value="searchText" @input="toSearch" placeholder="输入员工姓名"></a-input>
      <a-tree
          v-if="props.treeList.length!=0"
          :defaultExpandAll="true"
          v-model:selectedKeys="selectedKeys"
      
          :tree-data="props.treeList"
        >
          <template #title="row">
              <span  @click="treeSelect(row.id)">{{row.name}}</span>
          </template>
  </a-tree>
  </div>
</template>

<script lang="ts" setup>
    import {ref,defineProps,defineEmits} from 'vue'
    // antd官方 提供了 ts类型
    // import type { TreeProps } from 'ant-design-vue';
    // let props=defineProps({
    //   treeList:{
    //     type:Array,
    //     required:true
    //   },
    //   df:{
    //     type:Number
    //   }
    // })
    let props=defineProps<{
        treeList:Array<any>
    }>()
    console.log(props.treeList,"&&&&&&&&&&&&&&")
    

    let selectedKeys=ref([])
    let searchText=ref('')

    let emit=defineEmits(["sendWord",'sendDepid'])
    // 子传父 传递搜索值
    let toSearch=()=>{
        emit("sendWord",searchText.value)
    }
    // 子传父  传递部门id
    let treeSelect=(depId:any)=>{
        console.log(depId)
        emit("sendDepid",depId)
    }
</script>